<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title></title>
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link href="css/font-awesome.min.css" rel="stylesheet">
		<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
    <script src="js/html5shiv.min.js"></script>
    <script src="js/respond.min.js"></script>
    <![endif]-->
		<style type="text/css">
			body {
				padding-top: 0;
			}
		</style>
	</head>

	<body>

		<div class="container-fluid">
			<form id="sbmit">
				<div class="panel panel-default">
					<form>
						<div class="panel-heading">
							<form class="form-inline form-all">
								<input id="id" name="id" type="hidden" />
								<div class="form-group">
									<select class="form-control" id="type" style="width: 100px;float: left;">
										<option value="">类型</option>
										<option value="1">单片</option>
										<option value="2">剧头</option>
										<option value="3">分集</option>
									</select>
									<div class="input-group" style="width: 300px;float: left;">
										<div class="input-group-addon">名称</div>
										<input type="text" class="form-control input-group-sm" id="key" placeholder="标题" value="">
									</div>
									<button type="button" style="float: right;" class="btn btn-primary" id="btn-sub">查询</button>
								</div><br />
							</form>
						</div>
						<div class="table-responsive">
							<table class="table table-hover table-striped">
								<thead>
									<tr>
										<th>#</th>
										<!--<th>类型</th>-->
										<th class="col-md-2">标题</th>
									</tr>
								</thead>
								<tbody id="table-body"></tbody>
								<tr>
									<td colspan="4" class="text-right">
										<button id="save" type="button" style="float: right;" class="btn btn-primary">保存</button>
									</td>
								</tr>
							</table>
						</div>
					</form>
					<nav style="text-align: right">
						<ul class="pagination"></ul>
					</nav>
				</div>
			</form>
		</div>

		<script src="js/jquery.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<script src="js/url.min.js"></script>
		<script src="js/common.js"></script>
		<script language="JavaScript">
			var id = $.url('?id');
			var page = $.url('?page');
			var type = $.url('?type');
			var key = $.url('?key');
			var opts = {
				"page": (page != null) ? page : 1,
				"count": 10
			};
			$(function() {
				if(key != null && key != ""){
					$("#key").val(key);
					opts.key = key;
				}
				if(type != null && type != ""){
					$("#type").val(type);
					opts.type = type;
				}
				if(id != null && id != ""){
					$("#id").val(id);
					opts.id = id;
				}
//				console.info(opts);
				api.childcategorylist(opts);
//				api.comicCateGoryList();
			})
			$("#save").on("click", function(){
				var op = $("#sbmit").serialize();
				$.post(api_cfg.domain + "related_add", op, function(data){
					console.info("add-----------",data);
					if(data.err == 0){
						parent.reLoad();
					}else{
						msg("error");
					}
				});
			});
			$("#btn-sub").on("click", function(){
				var key = $("#key").val(), ptype = $("#type").val();
				if(key != ""){
					opts.key = key;
				}
				if(ptype != ""){
					opts.type = ptype;
				}
				opts.page = 1;
				api.comicProgramList(opts);
			});
		</script>
	</body>

</html>